<!--
 描述: 首页
-->
<template>
    <div class="home-container">
        <div class="wrap" ref="editor">
            <div class="top"></div>
            <!--中间-->
            <ringPiecun/>
            <bar3dcun/>
            <colorfulRadarcun/>
            <!--左边-->
            <!--蜘蛛网饼状图-->
            <circleRunwaycun/>
            <!--柱状图-->
            <gaugecun/>
            <!--新闻栏目展示栏-->
            <scanRadiuscun/>
            <!--右边-->
            <waterPolocunone/>
            <waterPolocuntwo/>
            <!--蜘蛛网状饼状图-->
            <waterPolocunthree/>
        </div>
    </div>
</template>
<script>
    import {screenSize} from '@/assets/js/utils'
    import ScanRadiuscun from "../components/cun/scanRadiuscun/index";
    export default {
        name: 'cun',
        components: {ScanRadiuscun},
        data() {
            return {}
        },
        computed: {},
        created() {
        },
        mounted() {
            screenSize(this.$refs.editor);
        },
        methods: {
            changeNum (val) {
                console.log('cun   '+val);
            }
        }
    }
</script>
<style lang="scss" scoped>
    .home-container {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        .wrap {
            transform-origin: 0px 0px 0px;
            background: url(../assets/img/bj.jpg) no-repeat;
            background-size: contain;
            background-position: 50% 0;
            background-color: rgb(0, 0, 0);
            min-width: auto;
            width: 1920px;
            min-height: auto;
            height: 1080px;
            overflow: auto;
            .top {
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 80px;
                background-color: transparent;
                background: url(../assets/img/top_n.png) no-repeat;
                background-position: 65% 0;
                border: none;
                overflow: hidden;
            }
            .divider {
                position: absolute;
                left: 50px;
                top: 3253px;
                width: 90%;
                height: 50px;
                width: 300px;
                border: none;
                background: transparent;
            }
        }
    }
</style>
